<template>
	<view class="page-container line-bg-container">
		<u-navbar bgColor="transparent" :placeholder="true" :autoBack="true" customClass="jc-navbar" title="快速(基本)设置">
		</u-navbar>
		<div class="content-container">
			<div class="p-mode ble-info">
				<u-collapse>
					<u-collapse-item title="管理员密码" :clickable="false">
						<u-row justify="space-between">
							<u-col span="10">
								<u--input type="number" placeholder="(请输入密码，如123456)" border="none" v-model="value"></u--input>
							</u-col>
							<u-col span="2">
								<u-icon size="18" name="setting" @click="setPwd"></u-icon>
							</u-col>
						</u-row>
					</u-collapse-item>
				</u-collapse>
				<u-cell title="蓝牙ID" :border="false">
					<view slot="value" class="u-slot-value-02 u-slot-ble-value">
						<u--input border="none" class="u-type-default" placeholder="(输入值)"
							v-model="bleId"></u--input>
						<u-icon size="18" name="setting"></u-icon>
					</view>
				</u-cell>
				<!-- <u-cell title="蓝牙ID" value="SCZF-007" :border="false"></u-cell> -->
			</div>
			<div class="s-type">
				<u-row gutter="10" justify="space-arround">
					<u-col span="3">
						<view class="s-type-item">一键三元(普压)</view>
					</u-col>
					<u-col span="3">
						<view class="s-type-item">一键三元(高压)</view>
					</u-col>
					<u-col span="3">
						<view class="s-type-item s-type-item-big">一键铁锂</view>
					</u-col>
					<u-col span="3">
						<view class="s-type-item s-type-item-big">一键钠电</view>
					</u-col>
				</u-row>
			</div>
			<div class="p-mode q-setting">
				<u-cell title="电池实际串数">
					<div slot="value" class="u-slot-value-01">
						<text>OS</text>
						<u--input type="number" border="none" v-model="value"></u--input>
						<text>设置</text>
					</div>
				</u-cell>
				<u-cell title="电池实际容量">
					<div slot="value" class="u-slot-value-01">
						<text>OAH</text>
						<u--input type="number" border="none" v-model="value"></u--input>
						<text>设置</text>
					</div>
				</u-cell>
				<u-cell title="过流保护延时">
					<div slot="value" class="u-slot-value-01">
						<text>OAH</text>
						<u--input type="number" border="none" v-model="value"></u--input>
						<text>设置</text>
					</div>
				</u-cell>
				<u-cell title="瞬间过流保护">
					<div slot="value" class="u-slot-value-01">
						<text>OAH</text>
						<u--input type="number" border="none" v-model="value"></u--input>
						<text>设置</text>
					</div>
				</u-cell>
				<u-collapse>
					<u-collapse-item title="修改管理员密码" :clickable="false">
						<u-row justify="space-between">
							<u-col span="10">
								<u--input type="number" placeholder="(请输入新密码，如123456)" border="none" v-model="value"></u--input>
							</u-col>
							<u-col span="2">
								<u-icon size="18" name="setting"></u-icon>
							</u-col>
						</u-row>
					</u-collapse-item>
				</u-collapse>
				<u-cell title="充满压差均衡">
					<u-switch :space="3" slot="right-icon" inactiveColor="#eeeeee"
						activeColor="linear-gradient(to right, #00107d , #8acbf1)" v-model="checked"></u-switch>
				</u-cell>
				<u-cell title="闲时压差均衡">
					<u-switch :space="3" slot="right-icon" inactiveColor="#eeeeee"
						activeColor="linear-gradient(to right, #00107d , #8acbf1)" v-model="checked"></u-switch>
				</u-cell>
				<u-cell title="闲时均衡触发">
					<div slot="value" class="u-slot-value-02">
						<u--input type="number" border="none" class="u-type-default" placeholder="(3.35)~(0.005)"
							v-model="value"></u--input>
						<text>设置</text>
					</div>
				</u-cell>
				<u-cell title="短路保护" :border="false">
					<u-switch :space="3" slot="right-icon" inactiveColor="#eeeeee"
						activeColor="linear-gradient(to right, #00107d , #8acbf1)" v-model="checked"></u-switch>
				</u-cell>
				<u-cell title="CAN显示屏" :border="false">
					<u-switch :space="3" slot="right-icon" inactiveColor="#eeeeee"
						activeColor="linear-gradient(to right, #00107d , #8acbf1)" v-model="checked"></u-switch>
				</u-cell>
			</div>
			<view class="m-type-item" style="margin-top: 30rpx;" @click="save">
				<text>保存参数·进入主界面</text>
			</view>
		</div>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value: '',
				checked: true,
				bleId: 'SCZF-007',
			}
		},
		methods: {
			setPwd() {
				this.$refs.uToast.show({
					type: 'default',
					message: "密码错误",
				})
			},
			save() {
				this.$refs.uToast.show({
					type: 'success',
					message: "保存成功",
					iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
				})
			},
		}
	}
</script>

<style lang="scss">
	page {
		background: linear-gradient(to right, #00107d 0%, #8acbf1 100%);
	}
	
	// .page-container {
	// 	height: 100vh;
	// 	position: relative;
	// }
	
	
</style>